﻿@* ReSharper disable UnknownCssClass *@

@model OpusSuite.Models.Model.Ref.DateFormat

<script src="@Url.Content("~/Scripts/grid.locale-en.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.jqGrid.min.js")" type="text/javascript"></script>

<div id="applicationMessages">@Html.Partial("ApplicationMessages", (IEnumerable<OpusSuite.Models.Model.Shared.ApplicationMessage>)ViewBag.ApplicationMessages)</div>        

@using (Html.BeginForm("DateFormatSelect", "Ref", FormMethod.Post, new { id = "dateFormatForm" }))
{
    <h2>Select / Add a date format</h2>
    <fieldset>
        <legend>Details</legend>

        <table class="table-editor">
        <tr>
            <td class="td-horiz-label">@Html.LabelFor(model => model.Code, new { @class = "label-horiz" })</td>
            <td class="td-horiz-field">@Html.TextBoxFor(model => model.Code, new { @class = "editor-horiz", @disabled = "disabled" })</td>
        </tr>
        <tr class="editor-label">
            <td class="td-horiz-label">@Html.LabelFor(model => model.Name, new { @class = "label-horiz" })</td>
            <td class="td-horiz-field">@Html.PasswordFor(model => model.Name, new { @class = "editor-horiz" })</td>
        </tr>        
        <tr class="editor-label">
            <td class="td-horiz-label">@Html.LabelFor(model => model.Description, new { @class = "label-horiz" })</td>
            <td class="td-horiz-field">@Html.PasswordFor(model => model.Description, new { @class = "editor-horiz" })</td>
        </tr>        
        </table>
    </fieldset>

    @* Stores the result for the dialog *@
    <label id="dialogDateFormatResultCode"></label>
    <label id="dialogDateFormatResultName"></label>
    
    <table id="list"></table>
    <div id="pager"></div>
}

@* ReSharper restore UnknownCssClass *@
@* ReSharper disable UnusedParameter *@
<script type="text/javascript">
    jQuery(document).ready(function () {
        jQuery("#list").jqGrid({
            url: '@Url.Action("DateFormatSelectData", "Ref")',
            datatype: 'json',
            mtype: 'GET',
            colNames: [' ', 'Code', 'Name', 'Description'],
            colModel: [
          { name: 'myac', width: 80, fixed: true, sortable: false, resize: false, formatter: 'actions', formatoptions: { keys: true} },
          { name: 'Code', index: 'Code', width: 100, align: 'left' },
          { name: 'Name', index: 'Description', width: 300, align: 'left' },
          { name: 'Description', index: 'Language', width: 150, align: 'left' }],
            pager: jQuery('#pager'),
            rowNum: 5,
            rowList: [5, 10, 20, 50],
            sortname: 'Name',
            sortorder: "asc",
            viewrecords: true,
            caption: 'Date Formats',
            onSelectRow: function(rowid, status) {
                $("#dialogDescriptionResultCode").text($(this).getCell(rowid, 'Code'));
                $("#dialogDescriptionResultName").text($(this).getCell(rowid, 'Name'));
            }
        });

    }); 
</script>
@* ReSharper restore UnusedParameter *@
